/* global */
.UX-calendar {
	cursor: default;
	position: absolute;
	z-index: 999;
	text-align: center;
	overflow: hidden;
}
.UX-calendar .box {
	float: left;
}
	.UX-calendar .head .arrow-left .al-year, 
	.UX-calendar .head .arrow-left .al-month {
		position: relative;
		cursor: pointer;
		visibility: visible;
		float: left;
	}
	.UX-calendar .head .arrow-right .ar-year, 
	.UX-calendar .head .arrow-right .ar-month {
		position: relative;
		cursor: pointer;
		visibility: visible;
		float: right;
	}
	.UX-calendar .head, .UX-calendar .body{
		width: 100%;
	}
	.UX-calendar .box .head .arrow-left {
		position: relative;
		z-index: 999;
		float: left;
	}

	.UX-calendar .box .head .label {
		position: relative;
		z-index: 998;
		visibility: visible;
		float: left;
	}

	.UX-calendar .box .head .arrow-right {
		position: relative;
		z-index: 999;
		float: right;
	}
	.UX-calendar .box .head .visibility{
		visibility: hidden;
	}
	
	.UX-calendar .body {
		position: relative;
		clear: both;
	}
	.UX-calendar .body table {
		width: 100%;
		margin: 0 auto;
	}
	
	.UX-calendar .body table th, .UX-calendar .body table td {
		text-align: center;
		line-height: 20px;
	}
	
	.UX-calendar .body .week-row table tr th.first, .UX-calendar .body .week-row table tr th.last {
		color: #ff540
	}
	.UX-calendar .body .day-rows table tr td {
		cursor: pointer;
	}
	.UX-calendar .body .day-rows table tr td.outside {
		color: #CCCCCC;
	}
	.UX-calendar .body .day-rows table tr td.non-selectable {
		color: #DCDCDC;
		cursor: default;
	}
	.UX-calendar .body .day-rows table tr td.nullDate {
		cursor: default;
	}
	.UX-calendar .body .day-rows table tr td.selected {
		color: #FF0000;
	}
	.UX-calendar .body .day-rows table tr td.hover {
		background: #888;
		color: #8EAEC1
	}
	.UX-calendar .body .day-rows table tr td.today {
		background: #fff3ae
	}
	
/* default */



.UX-calendar .box {
	width: 200px;
	height: auto;
	/* background: #E8F5FF; */
	background: #FFF;
	border-width: 1px 0 1px 1px; border-color: #7EB5E0; border-style: solid; 
	font-family: Trebuchet, Tahoma, Arial, sans-serif;
	font-size: 11px;
	color: #888;
	padding: 1px;
}
.UX-calendar .lastbox {
	border-right: 1px solid #7EB5E0
}

.UX-calendar .box .head {
	height: 25px;
	background: #C1E4FF;
	line-height: 25px;
	overflow: hidden;
	position: relative;
	padding-left: 10px;
	padding-right: 10px;
	width: 180px;
}

.UX-calendar .box .head .label {
	color: #000; font-size: 12px;
	font-weight: bold;
	width: 120px;
}

.UX-calendar .box .body {
	overflow: hidden;
	height: auto;
	background: #E8F5FF;
	padding-bottom: 8px;
	font-size: 12px;
	font-weight: normal
}

.UX-calendar .body table {
	width: 180px;
}

.UX-calendar .body table th {
	text-align: center;
	line-height: 24px;
}

.UX-calendar .body .week-row table tr th.first, .UX-calendar .body .week-row table tr th.last {
	color: #ff5400
}

.UX-calendar .body table td {
	text-align: center;
	border: 1px solid #7eb5e0;
	background: #FFF;
}

.UX-calendar .body .day-rows table tr td.hover {
	background: #E8F5FF;
	color: #8EAEC1
}
.UX-calendar .body .day-rows table tr td.selected {
	color: #FF0000;
	background: #fff3ae
}

.UX-calendar .box .head .arrow-left, .UX-calendar .box .head .arrow-right {
	width: 30px;
	height: 8px;
	top: 50%;
}

.UX-calendar .box .head .arrow-left .al-year, 
.UX-calendar .box .head .arrow-right .ar-year, 
.UX-calendar .box .head .arrow-left .al-month, 
.UX-calendar .box .head .arrow-right .ar-month {
	width: 8px;
	height: 8px;
	top: -50%;
}

.UX-calendar .box .head .arrow-left .al-year, .UX-calendar .box .head .arrow-left .al-month {
	margin-left: 4px;
}

.UX-calendar .box .head .arrow-right .ar-year, .UX-calendar .box .head .arrow-right .ar-month {
	margin-right: 4px;
}

.UX-calendar .box .head .arrow-left .al-month {
	background: transparent url(imgs/al-month.gif) center no-repeat;
}

.UX-calendar .box .head .arrow-right .ar-month {
	background: transparent url(imgs/ar-month.gif) center no-repeat;
}
	.UX-calendar .box .head .arrow-left .al-year {
		background: transparent url(imgs/al-year.gif) center no-repeat;
		
	}
	
	
	.UX-calendar .box .head .arrow-right .ar-year {
		background: transparent url(imgs/ar-year.gif) center no-repeat;
		
	}
	
	